import React, { FC, useContext } from 'react';
import { storeContext } from '../../pages/store/context';
import './index.less';

interface HeaderProps {
  title: string;
  onBack: () => void;
}

const Header: FC<HeaderProps> = (props: HeaderProps) => {
  const store = useContext(storeContext);
  const { test } = store;

  const { title, onBack } = props;
  return (
    <div className="header">
      <div className="header-back" onClick={onBack}>
        <svg width="42" height="42">
          <polyline
            points="25,13,16,21,25,29"
            stroke="#fff"
            strokeWidth="2"
            fill="none"
          />
        </svg>
      </div>
      <h1 className="header-title">
        {title}
        {test}
      </h1>
    </div>
  );
};

export default Header;
